<template>
    <el-dialog v-model="visible" title="购物车合并号码预览" width="750" draggable overflow>
        <div class="text-base leading-8">
            <div>
                分区合并号码共 {{ data.cartMergeZone.count }} 个
            </div>
            <div>
                <div class="text-gray-400">
                    前区合并号码共 {{ data.cartMergeZone.frontCount }} 个：
                </div>
                <div class="text-wrap" v-html="data.cartMergeZone.frontText"></div>
            </div>
            <div>
                <div class="text-gray-400">
                    后区合并号码共 {{ data.cartMergeZone.backCount }} 个：
                </div>
                <div class="text-wrap" v-html="data.cartMergeZone.backText"></div>
            </div>
            <div class="mt-2">
                全区合并号码共 {{ data.cartMergeAll.count }} 个
            </div>
            <div class="text-wrap leading-6" v-html="data.cartMergeAll.text"></div>
        </div>
        <template #footer>
            <el-button type="info" @click="onCopy()">复制</el-button>
            <el-button type="info" @click="visible = false">关闭</el-button>
        </template>
    </el-dialog>
</template>

<script setup>
import DltCartModel from '@/model/DltCartModel';
import { copyText } from '@/utils/Utils';
import { num_front } from '@/config/dlt-config';
import { ElMessageBox } from 'element-plus'
import { ref, watch } from 'vue';

let dltCartModel = new DltCartModel();
const data = ref({
    cartMergeZone: {
        frontText: '',
        backText: '',
        frontCount: 0,
        backCount: 0,
        count: 0,
        frontDrawalCount: 0,
        backDrawalCount: 0,
        drawalCount: 0,
    },
    cartMergeAll: {
        text: '',
        count: 0,
        drawalCount: 0,
    }
})

const visible = defineModel();

const props = defineProps({
    data: Array,
})

watch(() => props.data, () => {
    buildData();
})

const buildData = () => {
    if (props.data.length == 0) {
        return;
    }
    data.value.cartMergeZone = dltCartModel.calcCartForMerge('', props.data, false);
    data.value.cartMergeAll = dltCartModel.calcCartForMerge('', props.data, true);
    console.log(data.value)
}

const onCopy = () => {
    let frontArr = [], backArr = [], allArr = [];
    props.data.forEach((rowArr, i) => {
        allArr = allArr.concat(rowArr);
        if (i > 4) {
            backArr = backArr.concat(rowArr);
        } else {
            frontArr = frontArr.concat(rowArr);
        }
    })
    let text = '';
    frontArr = [...new Set(frontArr)].sort();
    backArr = [...new Set(backArr)].sort();
    allArr = [...new Set(allArr)].sort();
    text += '前区合并：\n' + frontArr.join(' ');
    text += '\n后区合并：\n' + backArr.join(' ');
    text += '\n全部合并：\n' + allArr.join(' ');
    text += '\n反选号码：\n' + num_front.filter(v => !allArr.includes(v)).join(' ');
    copyText(text);
    ElMessageBox.alert('复制成功');
}

buildData();
</script>